<template>
	<my-field :label="data.label" :needRightIcon="false">
		<view class="flex">
			<text v-if="data.readonly">{{obj.value}}</text>
			<u-number-box v-else v-model="obj.value" :step="data.config.step" :min="data.config.min" :max="data.config.max"></u-number-box>
		</view>
	</my-field>
</template>
<script>
import MyField from '@/pages_form/components/my-field.vue'
export default {
	components: {MyField},
    props: {
        data: {
            type: Object,
            required: true
        }
    },
    data(){
        return {
			obj: JSON.parse(JSON.stringify(this.data))
        }
    },
    watch:{
        obj: {
		    deep: true,
		    handler() {
			   this.$emit('fieldValueChange', this.obj)
		    }
        }
    }
}
</script>